<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html >
<head>
<script src="${ctxStatic}/angular/1.2.29/angular.js" type="text/javascript"></script>
</head>
<body ng-app="angularArea">
	<div ng-controller="inputController">
		<input ng-model="name" type="text" placeholder="please input your name">
		<input type="button" value="cliekButton" ng-click="clearInputValue()">
		<h1>{{name}}</h1>
	</div>
	
	<div ng-controller="numberController">
		<input ng-click="add(1)" type="button" value="+1">
		<input ng-click="substr(1)" type="button" value="-1">
		{{ number }}
	</div>
	
	<script type="text/javascript">
	var angularArea = angular.module("angularArea",[]);
	angularArea.controller("numberController", function($scope) {
		$scope.number = 0;
		$scope.add = function(n) {
			$scope.number += n;
		}
		$scope.substr = function(n) {
			$scope.number -= n;
		}
	});
		angularArea.controller("inputController", function($scope) {
			$scope.name = 'default value';
			$scope.clearInputValue = function() {
				$scope.name = '';
			}
		});
	</script>
</body>
</html>